<template>
	<div class="admin">
		<header>
			购书中心后台管理系统
			<router-link to="/home">返回前台</router-link>
		</header>
		<div class="contain">
			<div class="left2">
				<el-menu :router='true'>
					<el-menu-item index='/adm/category'>类型92版本</el-menu-item>
					<el-menu-item index='/adm/type'>类型93版本</el-menu-item>
					<el-menu-item index='/adm/adm2'>商品管理</el-menu-item>
					<el-menu-item index='/adm/adm3'>热度图片</el-menu-item>
					<el-menu-item index="/adm/adm4">订单发货</el-menu-item>
					<el-menu-item index="/adm/adm5">用户列表</el-menu-item>
					<el-menu-item index="/adm/adm6">管理员添加</el-menu-item>
				</el-menu>
			</div>
			<div class="right">
				<router-view></router-view>
			</div>
		</div>
	</div>
</template>

<script>
export default{
	name : 'Admin'
}
</script>

<style scoped>
.admin{
	overflow: hidden;
	width: 100%;
	background-color: #EEEEEE;
}
.admin header{
	width: 100%;
	line-height: 70px;
	background-color: white;
	text-indent: 2em;
	color: #FFA500;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.admin header a{
	font-size: 14px;
	text-decoration: none;
	font-weight: normal;
	color: #FFFFFF;
	background-color: deepskyblue;
	text-indent: 0;
	height: 35px;
	line-height: 35px;
	margin-right: 30px;
	padding: 0 30px;
	border-radius: 6px;
}
.admin .contain{
	width: 98%;
	margin: 15px auto;
	height: 100%;
}
.admin .left2{
	height: 100%;
	float: left;
	width: 20%;
	background-color: aquamarine;
}
.admin .left2 ul li:first-child{
	line-height: 60px;
	text-align: center;
	color: deepskyblue;
	font-size: 22px;
}
.admin .left2 ul li a{
	display: block;
	width: 100%;
	text-decoration: none;
	color: deepskyblue;
	line-height: 45px;
	text-align: center;
	margin-bottom: 10px;
}
.admin .left2 ul li .router-link-exact-active{
	background-color: deepskyblue;
	color: white;
}
.admin right{
	height: 100%;
	width: 65%;
	float: right;
	background-color: white;
}
</style>